<md-dialog flex="60">
    <md-toolbar>
        <div class="md-toolbar-tools">
            <h2>Force Close Receipt: {{receipt.id}}</h2>
            <span flex></span>
            <md-button class="md-icon-button" ng-click="closeDialog()">
                <i class="material-icons">close</i>
            </md-button>
        </div>
    </md-toolbar>
    <md-dialog-content style="padding: 20px 0px;">
        <form novalidate name="editForm" novalidate ng-submit="editForm.$valid && submit()">
            <div style="padding: 0px 20px;">

                <div class="row form-group" style="margin-bottom: 30px;">
                    <div class="col-md-1" style="text-align: right;">Reason:<span style="color: red;">*</span></div>
                    <div class="col-md-8">
                        <textarea name="reason" required="true" class="form-control" rows="3" ng-model="resonInfo.reason"></textarea>
                    </div>
                </div>

                <div class="row form-group">
                    <div class="col-md-12"><span>Total ItemLines: <b>{{itemLines.length}}</b></span>
                        <span style="margin-left:30px;">Exception ItemLines: <span style="color: red;"><b>{{exceptionItemLines}}</b></span></span>
                    </div>
                </div>

                <div class="table-scrollable">
                    <table class="table table-striped table-bordered table-hover">
                        <thead>
                        <tr>
                            <th>Item</th>
                            <th>Item Desc</th>
                            <th>UOM</th>
                            <th>Expected Qty</th>
                            <th>Received Qty</th>
                            <th>Received UOM</th>
                            <th>Lot#</th>
                            <th>Pallet Qty</th>
                            <th>Supplier</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr ng-repeat="item in itemLines track by $index" >
                            <td>{{item.itemSpecName}}</td>
                            <td>{{item.desc}}</td>
                            <td>{{item.unit.name}}</td>
                            <td >{{item.qty}}</td>
                            <td ng-class="{'itemLine_noMatch':!item.qtyIsMatch}">{{item.receivedQty}}</td>
                            <td ng-class="{'itemLine_noMatch':!item.unitIsMatch}">{{item.receivedUnit.name}}</td>
                            <td>{{item.lotNo}}</td>
                            <td>{{item.palletQty}}</td>
                            <td>{{item.supplierName}}</td>
                        </tr>
                        </tbody>
                    </table>
                </div>
                <!--<pager total-count="itemLines.length" page-size="pageSize" load-content="loadContent_itemLines(currentPage)"></pager>-->

            </div>


            <div class="form-group form-self-actions" style="padding: 20px 75px 0px 0px; margin-top:20px; height: 50px; border-top: 1px solid #ddd;">
                <div style="float: left; color: red; width: 450px; text-align: left; padding-left: 20px;">{{ errorMsg }}</div>
                <waitting-btn type="submit" btn-class="btn blue" value="'Save'" is-loading="saving"></waitting-btn>
                <button type="button" class="btn default" ng-click="closeDialog()">Cancel</button>
            </div>
        </form>
    </md-dialog-content>
</md-dialog>